<template>
	<div>
		<Table :where="where" :url="url" ref="Table" :col="6" :select="select" @selectChange="selectChange" :selectData="selectData" uniqueKey="commodityid">
			<div slot="hd-btn" v-if="!select">
				<el-button type="primary" class="btn-box" @click="add">添加奖品</el-button>
			</div>
			<el-table-column prop="commodityid" label="id" align='center'>
			</el-table-column>
			<el-table-column prop="commodity_name" label="商品名称" align='center'>
			</el-table-column>
			<el-table-column prop="commodity_desc" label="商品介绍" align='center'>
			</el-table-column>
			<el-table-column prop="label_name" label="标签名称" align='center'>
			</el-table-column>
			<el-table-column prop="market_price" label="推荐理由" align='center'>
			</el-table-column>
			<el-table-column prop="market_price" label="市场价" align='center'>
			</el-table-column>
			<el-table-column prop="sale_money" label="销售价" align='center'>
			</el-table-column>
			<el-table-column prop="invest_money" label="投资金额" align='center'>
			</el-table-column>
			<el-table-column prop="invest_full_num" label="已投满数量" align='center'>
			</el-table-column>
			<el-table-column prop="invest_not_full_num" label="未投满数量" align='center'>
			</el-table-column>
			<el-table-column prop="c_by" label="创建人ID" align='center'>
			</el-table-column>
			<el-table-column prop="u_by" label="修改人ID" align='center'>
			</el-table-column>
			<el-table-column label="创建时间" width="200">
				<template slot-scope="scope">
					<i class="el-icon-time"></i>
					<span style="margin-left: 10px">{{ scope.row.create_time }}</span>
				</template>
			</el-table-column>
			<el-table-column label="更新时间" align='center' width="200">
				<template slot-scope="scope">
					<i class="el-icon-time"></i>
					<span style="margin-left: 10px">{{ scope.row.update_time }}</span>
				</template>
			</el-table-column>
			<el-table-column label="操作" fixed="right" align='center' width="180" v-if="!select">
				<template slot-scope="scope">
					<el-button size="mini" @click="edit(scope.row)">编辑</el-button>
					<el-button size="mini" type="danger" @click="del(scope.row)">删除</el-button>
				</template>
			</el-table-column>
		</Table>
		<Dialog @close="close" @confirm="confirm" :dialogISshow="dialogISshow" v-if="dialogISshow" :options='options' title="新建奖品">
		</Dialog>
	</div>
</template>
<script>
// import selfBuilt from './mixin/self-built.js';
import { where, dialog } from '../form/goods-list';

// import { input, select,requiredInput } from 'project/admin/utils/form';
export default {
	props: {
		select: {
			type: Boolean,
			default: false,
		},
		selectData: {
			type: Object,
			default() {
				return {};
			},
		},
		// uniqueKey:{
		// 	type:String,
		// 	default:'id'
		// }
	},
	data() {
		return {
			prizeTypeName: {
				21: '现金',
				22: '体验金',
				1: '加息劵',
				2: '折扣卷',
				4: '火箭卷',
				5: '提现劵',
			},
			url: '/admin/zeroyuanBuy/getGoodsList',
			dialogISshow: false,
			// return
			where,
			baseOptions: JSON.parse(JSON.stringify(dialog)),
			options: dialog,
			// department: ['公共部门', '运营', '渠道', '市场', '会员中心'],
			submitIng: false,
			id: '',
			operationType: '',
		};
	},
	// mixins: [selfBuilt],
	mounted() {
		// this.$refs.Table._search()
		//
		// let a = requiredInput()
	},
	// mixins:[table],
	methods: {
		confirm(formData) {
			console.log('%c gc_formData=>: ', 'color: MidnightBlue; background: Aquamarine; font-size: 20px;', formData);
			let type = this.operationType;
			let times = formData.times;
			if (times) {
				formData.end_time = times[1];
			}
			let result = {};
			if (!type) {
				if (times) {
					formData.start_time = times[0];
				}
				result = this.$http('/admin/zeroyuanBuy/addGoods', formData);
			} else if ((type = 'edit')) {
				formData.commodityid = this.id;
				result = this.$http('/admin/zeroyuanBuy/upDataGoods', formData);
			}
			result
				.then(res => {
					log.ok(res.msg);
					this.dialogISshow = false;

					this.$refs.Table._search();
					// this.$refs.Table._search();
				})
				.catch(err => {});
		},
		add() {
			this.dialogISshow = true;
		},
		close() {
			this.dialogISshow = false;
			this.clearn();
		},
		async edit(data) {
			let photos = await this.getPotos(data.commodityid);
			data.photo_path1 = photos.photo_path1
			data.photo_path2 = photos.photo_path2
			this.dialogISshow = true;
			this.operationType = 'edit';
			// this.options.start_time.disabled = true;
			this.disabled(['start_time', 'name', 'department', 'type']);
			this.fill(data);
		},
		async getPotos(commodityid) {
			try {
				return (await this.$http('/admin/zeroyuanBuy/getPhoto', { commodityid })).data;
			} catch (error) {
				log.warn(error);
			}
		},
		disabled(ary = []) {
			let options = this.options;
			ary.forEach(key => {
				if (options.hasOwnProperty(key)) {
					options[key].disabled = true;
				}
			});
		},
		fill(data) {
			let options = this.options;
			this.id = data.commodityid;
			for (let key in options) {
				if (data.hasOwnProperty(key)) {
					options[key].value = data[key];
					options[key].hasOwnProperty('fileList') ? (options[key].fileList = data[key]) : '';
				}
			}
			this.timesFill('start_time', options, data);
		},
		timesFill(disabledType, options, data) {
			if (options.hasOwnProperty('times')) {
				options.times.value = [data.start_time || '', data.end_time || ''];
				options.times[disabledType] = true;
			}
		},
		del(data) {
			this.$msgbox({
				title: '提示',
				message: '删除后不可恢复，是否要删除！',
				showCancelButton: true,
				center: true,
			}).then(res => {
				this.$http('/admin/active/DelselfCreatePrize', { commodityid: data.commodityid })
					.then(res => {
						log.ok(res.msg);
						this.$refs.Table._search();
					})
					.catch(err => {});
			});
		},
		selectChange(data) {
			for (let key in data) {
				data[key].forEach(item => {
					//
					item.url = this.parse(item.url, item.url);
				});
			}
			this.$emit('selectChange', data);
		},
		clearn() {
			for (let key in this.options) {
				this.options[key].value = this.baseOptions[key].value;
				this.options[key].disabled = this.baseOptions[key].disabled;
			}
			console.log('%c gc_this.baseOptions[key].value=>: ', 'color: MidnightBlue; background: Aquamarine; font-size: 20px;', this.options);
			// this.operationType = '';
			// this.options.times['start_time'] = false;
			// this.options.times['end_time'] = false;
			// console.log('%c gc_this.options=>: ', 'color: MidnightBlue; background: Aquamarine; font-size: 20px;', this.baseOptions);
		},
	},
};
</script>
